<template>
    <div v-if="show_unpreview" @click="change_unknown" class="unpreview">
        <p>当前文件不支持预览
            <Button @click="down" type="primary"> 立即下载</Button>
        </p>

    </div>
</template>

<script>
    export default {
        props: ['file_url', 'show_unpreview'],
        data() {
            return {

            }
        },
        methods: {
            down() {
                window.location.assign(this.file_url)
                this.$emit('change_unknown')
            },
            change_unknown() {
                this.$emit('change_unknown')
            }
        }
    }
</script>

<style lang='less' scoped>
    .unpreview {
        width: 100vw;
        height: 100vh;
        position: absolute;
        z-index: 999;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, .6);

        p {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 20px;
            color: #fff;
        }


    }
</style>